<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="../../Templates/SubFolderTemplate.xhtml"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core">
    <ui:define name="head-title">
        <title>View Employee | Merlion's ERP System</title>
    </ui:define>
    
    <ui:define name="content">
        <f:view beforePhase="#{viewEmployeeManagerBean.initView}">
        <h:form prependId="false">
            <p:dataTable var="employee" value="#{viewEmployeeManagerBean.employees}" 
                         dynamic="true" paginator="true" rows="5" emptyMessage="No employee found in database." selection="#{viewEmployeeManagerBean.selectedEmployee}"> 
                
                <p:column selectionMode="single"/>
                
                <p:column sortBy="#{employee.employeeId}" filterBy="#{employee.employeeId}">
                    <f:facet name="header">
                        <h:outputText value="ID"/>
                    </f:facet>
                    <h:outputText value="#{employee.employeeId}"/>
                </p:column>
                
                <p:column sortBy="#{employee.userName}" filterBy="#{employee.userName}">
                    <f:facet name="header">
                        <h:outputText value="UserName"/>
                    </f:facet>
                    <h:outputText value="#{employee.userName}"/>
                </p:column>
                
                <p:column sortBy="#{employee.employeeName}" filterBy="#{employee.employeeName}">
                    <f:facet name="header">
                       <h:outputText value="Name"/>
                    </f:facet>
                    <h:outputText value="#{employee.employeeName}"/>
                </p:column>
                
                <p:column sortBy="#{employee.attempt}" filterBy="#{employee.attempt}">
                    <f:facet name="header">
                        <h:outputText value="Attempt"/>
                    </f:facet>
                    <h:outputText value="#{employee.attempt}"/>
                </p:column>
                
                <p:column sortBy="#{employee.activatedStatus}" filterBy="#{employee.activatedStatus}">
                    <f:facet name="header">
                        <h:outputText value="Activated Status"/>
                    </f:facet>
                    <h:outputText value="#{employee.activatedStatus}"/>
                </p:column>
                
                <p:column sortBy="#{employee.position}" filterBy="#{employee.position}">
                    <f:facet name="header">
                        <h:outputText value="Position"/>
                    </f:facet>
                    <h:outputText value="#{employee.position.description}"/>
                </p:column>
                
                <f:facet name="footer">
                    <p:commandButton value="View" image="ui-icon ui-icon-search" update="display1" oncomplete="employeeViewDialog.show()"/>
                    <p:commandButton value="Edit" image="ui-icon ui-icon-pencil" actionListener="#{viewEmployeeManagerBean.editEmployee}" rendered="#{controller.adminEditable}"/>
                    <p:commandButton value="Delete" image="ui-icon ui-icon-close" actionListener="#{viewEmployeeManagerBean.deleteEmployee}" rendered="#{controller.adminDeletable}"/>
                </f:facet>
        </p:dataTable>

        <p:dialog header="Employee Detail" widgetVar="employeeViewDialog" width="400" height="400" resizable="false" showEffect="fold" hideEffect="fold">
            <h:panelGrid id="display1" columns="2" cellpadding="4">
                <h:outputText value="Employee's ID:"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.employeeId}"/>
                <h:outputText value="Employee's Name"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.employeeName}"/>
                <h:outputText value="Employee's Username:"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.userName}"/>
                <h:outputText value="Employee's NRIC:"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.employeeNRIC}"/>
                <h:outputText value="Employee's Adress:"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.employeeAddress}"/>
                <h:outputText value="Employee's Contact Number:"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.employeeContactNumber}"/>
                <h:outputText value="Employee's Email Address:"/>
                <h:outputText value="#{viewEmployeeManagerBean.selectedEmployee.employeeEmail}"/>
            </h:panelGrid>
        </p:dialog>            
                    
        </h:form>
        </f:view>
    </ui:define>

</ui:composition>
